import React, {useEffect, useState} from 'react'
import axios from 'axios'
import { Table, Button, Tag } from 'antd';
import { 
    PoweroffOutlined, 
    SyncOutlined, 
    HeartTwoTone,
    SmileTwoTone,
    FacebookOutlined 
} from '@ant-design/icons';
import PandaIcon from '../../../assets/icon/PandaSvg'
import style from './audit-list.module.css'

export default function Audit(props) {
  const [dataSource, setdataSource] = useState([])
const columns = [
  {
    title: '新闻标题',
    dataIndex: 'title',
    key: 'title',
  },
  {
    title: '作者',
    dataIndex: 'author',
    key: 'author',
  },
  {
    title: '新闻分类',
    dataIndex: 'gender',
    key: 'gender',
  },
  {
    title: '审核状态',
    dataIndex: 'audioState',
    key: 'audioState',
    render(text) {
      return tagFilter(text)
    },
  },
  {
    title: '操作',
    key: 'ccccc',
    align: 'center',
    render(text, item) {
      return (
        <div className={style.btnList}>
          <Button 
            type="default" 
            danger 
            icon={<PoweroffOutlined />}
          >
            驳回
          </Button>
          <Button 
            type="dashed" 
            icon={<PandaIcon spin />}
            onClick={() => handleAudit}
          >
            通过
          </Button>
        </div>
      )
    }
  }
];
function handleAudit() {
  
}
function handleUpdate(val) {
  props.history.push(`/news-manage/update/${val.roleId}`)
}
function tagFilter(val) {
  if (val === 1) {
    return (
      <Tag color="magenta">未通过</Tag>
    )
  } else {
    return (
      <Tag icon={<FacebookOutlined />} color="#3b5999">
        Facebook
      </Tag>
    )
  }
}
  useEffect(() => {
    axios.get('/userList/getNews').then(res => {
      const {data: {data}} = res
      setdataSource(data)
    })
  }, [])

  return (
    <div>
      <Table 
        dataSource={dataSource} 
        columns={columns}
        rowKey={item => item.roleId} 
      />;
    </div>
  )
}
